<template>
  <el-form label-width="96px" >
    <div class="box">
      <h3>人员个人信息</h3>
      <el-form-item label="姓名">
        <el-input v-model.trim="info_modal.form_data.teacherName" />
      </el-form-item>
      <el-form-item label="性别">
        <el-radio-group
          v-model="info_modal.form_data.gender"
          class="ml-4"
        >
          <el-radio
            label="0"
            size="large"
          >女</el-radio>
          <el-radio
            label="1"
            size="large"
          >男</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="证件照">
        <el-text>本人近 1 年内正面、免冠、无妆、彩色电子证件照（白色 / 蓝色背景，用于证件照片）</el-text>
        <UploadImage v-model="info_modal.form_data.documentImg" />
      </el-form-item>
      <el-form-item label="证件类型">
        <el-select v-model="info_modal.form_data.documentType">
          <el-option
            label="身份证"
            value="idcard"
          ></el-option>
          <el-option
            label="护照"
            value="passport"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="证件号码">
        <el-input v-model="info_modal.form_data.documentNumber" />
      </el-form-item>
      <el-form-item label="手机号码">
        <el-input v-model="info_modal.form_data.phone" />
      </el-form-item>
    </div>
    <div class="box">
      <h3>所属学校与地区</h3>
      <el-form-item label="所属学校">
        <el-input v-model="info_modal.form_data.schoolName" />
      </el-form-item>
      <el-form-item label="所属市区">
        <ProvinceSelect :isW="true" 
          v-model:economize="info_modal.form_data.economize"
          v-model:market="info_modal.form_data.market"
          v-model:county="info_modal.form_data.county"
          :showCounty="true"
        />
      </el-form-item>
    </div>
    <div class="box">
      <el-form-item>
        <el-button
          type="primary"
          size="large"
          @click="handleSubmit"
          color="#1964d6"
        >保存信息</el-button>
      </el-form-item>
    </div>
  </el-form>
</template>

<script  setup>
import ProvinceSelect from "@/components/province-select/index.vue"
import UploadImage from "@/components/upload-image/index.vue"
import { AddTeacherApi } from "@/api/manage/institution"
import { ref } from "vue";
import { ElMessage } from "element-plus"

const emit = defineEmits(['sub'])
/**
 * 信息弹窗数据
 */
const info_modal = ref({
  form_data: {
    gender: "1"
  }
})

const handleRest = () => {
  info_modal.value.form_data = {
    "teacherName": "",
    "gender": "1",
    "documentImg": "",
    "documentType": "",
    "documentNumber": "",
    "phone": "",
    "schoolName": "",
    "economize": 0,
    "market": 0,
    "county": 0,
  }
}
/**
 * 获取学生信息
 */
const handleGetInfo = async (row) => {

  info_modal.value.form_data = row;
  return;
  let res = await GetStudentInfoApi({
    teacherId: row.teacherId
  })
  if (res.success) {
    info_modal.value.form_data = res.entity;
  }

}


/**
 * 保存信息
 */
const handleSubmit = async () => {
 
  let res;
  res = await AddTeacherApi(info_modal.value.form_data);
  if (res.success) {
    ElMessage.success(res.message);
    emit('sub', res)
  } else {
    ElMessage.error(res.message)
  }

}
defineExpose({
  handleGetInfo,
  handleRest
})
</script>

<style lang="scss" scoped>
.box {
  padding-bottom: 32px;
  padding-left: 32px;
  width: 640px;
  h3 {
    margin-bottom: 16px;
  }
}
</style>